import React, { PureComponent, Fragment } from 'react';
import { connect } from 'dva';
import {
  Card, Checkbox, Divider,
  Form,
  message, Modal, Table,
} from 'antd';
import PageHeaderWrapper from '@/components/PageHeaderWrapper';
import DescView from './descView';
import styles from '../UserManage.less';
import { powerBtnFunc } from '@/utils/utils';

const confirm = Modal.confirm;

/* eslint react/no-multi-comp:0 */
@connect(({ Apply, loading }) => ({
  Apply,
  loading: loading.effects['Apply/fetch'],
}))

@Form.create()
class Apply extends PureComponent {
  constructor(props) {
    super(props);
    this.state = {
      lookDescView: false,
      selectedRows: {},
      pagination: {
        pageNo: 1,
        pageSize: 15,
      },
    };
  }

  componentWillUpdate() {
    this.state = {
      selectedRows: {},
    };
  }

  componentDidMount() {
    this.getList();
    this.state = {
      lookDescView: false,
      selectedRows: {},
      pagination: {
        pageNo: 1,
        pageSize: 15,
      },
    };
  }

  applyColumns = [
    {
      title: '标的名称',
      dataIndex: 'projectName',
      key: 'projectName',
    },
    {
      title: '融资金额',
      dataIndex: 'amount',
      key: 'amount',
    },
    {
      title: '编号',
      dataIndex: 'loanNo',
      key: 'loanNo',
    },

    {
      title: '募集金额',
      dataIndex: 'raiseAmount',
      key: 'raiseAmount',
    },
    {
      title: '已提现金额',
      dataIndex: 'withdrawAmount',
      key: 'withdrawAmount',
    },
    {
      title: '可提现金额',
      dataIndex: 'withdraw',
      key: 'withdraw',
    },
    {
      title: '起息日',
      dataIndex: 'interestTime',
      key: 'interestTime',
    },
    {
      title: '操作',
      render: (text, record) => (
        <div>
          <a onClick={() => this.handleWithdraw(record)}>提现</a>
        </div>
      ),
    },
  ];
  columns = [

    {
      title: '企业编号',
      dataIndex: 'enterpriseNo',
      key: 'enterpriseNo',
    },
    {
      title: '企业名称',
      dataIndex: 'enterpriseName',
      key: 'enterpriseName',
    },

    {
      title: '余额',
      dataIndex: 'balance',
      key: 'balance',
    },
    {
      title: '可提现余额',
      dataIndex: 'withdrawAmount',
      key: 'withdrawAmount',
    },
    {
      title: '操作',
      render: (text, record) => (
        <div>
          <a key={'view'} onClick={() => this.handleLookDesc(true, record)}>查看可提现清单</a>
        </div>
      ),
    },
  ];
  getList = () => {
    const { pagination } = this.state;
    const { dispatch } = this.props;
    dispatch({
      type: 'Apply/fetch',
      payload: pagination,
    });
    dispatch({
      type: 'Apply/enterpriseList',
      payload: {},
    });

  };


  //查看
  handleLookDesc = (flag, record) => {
    const { dispatch } = this.props;
    console.log(record);
    this.setState({
      selectedRows: record,
    });
    dispatch({
      type: 'Apply/detail',
      payload: { code: record.enterpriseNo },
    });
  };
  handleWithdraw = (record) => {
    const { dispatch } = this.props;
    const { selectedRows } = this.state;
    confirm({
      title: `确定`,
      content: `你确定提现?`,
      okText: '确认',
      cancelText: '取消',
      onOk() {
        dispatch({
          type: 'Apply/withdraw',
          payload: {
            enterpriseNo: selectedRows.enterpriseNo,
            loanNoList: [record.loanNo],
          },
          callback(res) {
            if (res.msg.url) {
              window.open(res.msg.url);
            }
          },
        });
      },
      onCancel() {
        console.log('Cancel');
      },
    });
  };

  render() {
    const { Apply: { data, details }, loading } = this.props;
    const {  selectedRows } = this.state;
    let totalAmount = data.totalAmount ? data.totalAmount : 0;
    return (
      <PageHeaderWrapper title="融资申请">

        <div className={styles.tableList}>
          <Card
            title={'融资申请列表(' + totalAmount + '元)'}
            style={{ marginBottom: 24 }}
            bordered={false}>
            <Table
              pagination={false}
              rowKey={'enterpriseNo'}
              loading={loading}
              dataSource={data.entList ? data.entList : []}
              columns={this.columns}
            />
          </Card>

        </div>

        {
          Object.keys(selectedRows).length>0 ?
            <Card
              title={'可提现清单'}
              style={{ marginBottom: 24 }}
              bordered={false}>
              <Table
                pagination={false}
                rowKey={'enterpriseNo'}
                dataSource={details ? details : []}
                columns={this.applyColumns}
              />
            </Card>
            : ''}
      </PageHeaderWrapper>
    );
  }
}

export default Apply;
